<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>AdminLTE | factory management</title>
        <meta content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no' name='viewport'>
        <!-- bootstrap 3.0.2 -->
        <link href="../css/bootstrap.min.css" rel="stylesheet" type="text/css" />
        <!-- font Awesome -->
        <link href="../css/font-awesome.min.css" rel="stylesheet" type="text/css" />
        <!-- Ionicons -->
        <link href="../css/ionicons.min.css" rel="stylesheet" type="text/css" />
      <!-- Theme style -->
        <link href="../css/AdminLTE.css" rel="stylesheet" type="text/css" />

    	<style type="text/css">
    		.star{
    			color: red;
    		}
    		.special{
    			border: 1px solid black;
    		}
    		.style label{
    			width: 15%;
    		} 
    	</style>
    </head>
    <body class="skin-blue">
        <!-- header logo: style can be found in header.less -->
        <#include "../header.html"/>
        <div class="wrapper row-offcanvas row-offcanvas-left">
            <!-- Left side column. contains the logo and sidebar -->
            <#include "../menu.html"/>
            <!-- Right side column. Contains the navbar and content of the page -->
            <aside class="right-side">
            	<section class="content-header">
                    <h1>新增工厂</h1>
                    <ol class="breadcrumb">
                        <li><a href="#">工厂管理</a></li>
                        <li><a href="#">新建工厂</a></li>
                    </ol>
                </section>
                <!-- Main content -->
                <section class="content" >
                    <div class="row">
                        <div class="col-md-12">
                            <div class="box" style="padding: 20px;">
                                
                                <div class="box-title">
                                <form id="form" method="post" enctype="multipart/form-data">
                                	<table class="table table-bordered">
                                    	<tr>
                                    		<td>
                                    			<span class="star">*</span>
                                    			<span>工厂名称</span>
                                    		</td>
                                    		<td colspan="5">
                                    			<input id="factoryName" name="factoryName" style="width:250px" type="text" placeholder="请输入工厂名称" />
                                    		</td>
                                    	</tr>
                                    	<tr>
                                    		<td>
                                    			<span class="star">*</span>
                                    			<span>工厂地址</span>
                                    		</td>
                                    		<td colspan="5">
                                    			<div style="overflow: hidden;">
													<div style="float: left; margin-right: 5px;">
														<select id="province" name="provinceId">
															<option value="0">请选择</option>
														</select>
													</div>
													<div style="float: left; margin-right: 5px;">
														<select id="city" name="cityId">
															<option value="0">请选择</option>
														</select>
													</div>
													<div style="float: left;">
														<select id="area" name="areaId">
															<option value="0">请选择</option>
														</select>
													</div>
												</div>
												<div>
													<input id="detailAddress" name="detailAddress" style="width:250px"    type="text" placeholder="填写详细地址" />
												</div>
                                    		</td>
                                    	</tr>
                                    	<tr>
                                    		<td>
                                    			<span class="star">*</span>
                                    			<span>联系人</span>
                                    		</td>
                                    		<td>
                                    			<input id="linkman" name="linkman"  type="text"  />
                                    		</td>
                                    		<td>
                                    			<span class="star">*</span>
                                    			<span>联系电话</span>
                                    		</td>
                                    		<td colspan="3">
                                    			<input id="contact" name="contact" type="text" />
                                    		</td>
                                    	</tr>
                                    	<tr>
                                    		<td>
                                    			<span class="star">*</span>
                                    			<span>工厂人数</span>
                                    		</td>
                                    		<td colspan="5">
                                    			<div id="personAmount" class="style">
                                    				<label>
	                                					<input type="radio" name="personAmount"  />50人以下
	                                				</label>
	                                				<label>
	                                					<input type="radio" name="personAmount" />50~100人
	                                				</label>
	                                				<label>
	                                					<input type="radio" name="personAmount" />100~200人
	                                				</label>
	                                				<label>
	                                					<input type="radio" name="personAmount" />200人以上
	                                				</label>
                                    			</div>
                                    		</td>
                                    	</tr>
                                    	<tr>
                                    		<td>
                                    			<span class="star">*</span>
                                    			<span>梳织类型</span>
                                    		</td>
                                    		<td colspan="5">
                                    			<div id="tattingStyle" class="style" style="margin-bottom: 15px;">
                                    				<label>
                                    					<input type="checkbox" name="tattingStyle" />羽绒服
                                    				</label>
                                    				<label>
                                    					<input type="checkbox" name="tattingStyle" />短裙
                                    				</label>
                                    				<label>
                                    					<input type="checkbox" name="tattingStyle" />夹克
                                    				</label>
                                    				<label>
                                    					<input type="checkbox" name="tattingStyle" />裤子
                                    				</label>
                                    				<label>
                                    					<input type="checkbox" name="tattingStyle" />外套
                                    				</label>
                                    				<label>
                                    					<input type="checkbox" />衬衣
                                    				</label>
                                    			</div>
                                    		</td>
                                    		
                                    		
                                    		
                                    		
                                    	</tr>
                                    	<tr>
                                    		<td>
                                    			<span class="star">*</span>
                                    			<span>针织类型</span>
                                    		</td>
                                    		<td colspan="5">
                                    			<div id="wovenStyle" class="style" style="margin-bottom: 15px;">
                                    				<label>
                                    					<input type="checkbox" />外套
                                    				</label>
                                    				<label>
                                    					<input type="checkbox" />连衣裙
                                    				</label>
                                    				<label>
                                    					<input type="checkbox" />裤子
                                    				</label>
                                    				<label>
                                    					<input type="checkbox" />短裙
                                    				</label>
                                    			</div>
                                    		</td>
                                    	</tr>
                                    	<tr>
                                    		<td>
                                    			<span class="star">*</span>
                                    			<span>毛衣类型</span>
                                    		</td>
                                    		<td colspan="5">
                                    			<div id="sweaterStyle" class="style" style="margin-bottom: 15px;">
                                    				<label>
                                    					<input type="checkbox" />外套
                                    				</label>
                                    				<label>
                                    					<input type="checkbox" />短裙
                                    				</label>
                                    				<label>
                                    					<input type="checkbox" />开衫
                                    				</label>
                                    				<label>
                                    					<input type="checkbox" />圆领
                                    				</label>
                                    				
                                    			</div>
                                    		</td>
                                    	</tr>
                                    	<tr>
                                    		<td>
                                    			<span class="star">*</span>
                                    			<span>销往目的地</span>
                                    		</td>
                                    		<td id="saleTarget" colspan="5">
                                    			<label style="margin-right: 20px;">
                                    				<input type="radio" name="saleTarget" />内销
                                    			</label>
                                    			<label>
                                    				<input type="radio" name="saleTarget" />外销
                                    			</label>
                                    		</td>
                                    	</tr>
                                    	<tr>
                                    		<td>
                                    			<span class="star">*</span>
                                    			<span>合作条件</span>
                                    		</td>
                                    		<td colspan="5">
                                    			<div id="cooperationCondition" class="style">
                                    			<label>
                                    				<input type="radio" name="cooperationCondition" />20件以下
                                    			</label>
                                    			<label>
                                    				<input type="radio" name="cooperationCondition" />20~50件
                                    			</label>
                                    			<label>
                                    				<input type="radio" name="cooperationCondition" />50~100件
                                    			</label>
                                    			<label>
                                    				<input type="radio" name="cooperationCondition" />100~300件
                                    			</label>
                                    			<label>
                                    				<input type="radio" name="cooperationCondition" />300件以上
                                    			</label>
                                    			</div>
                                    		</td>
                                    	</tr>
                                    	<tr>
                                    		<td>
                                    			<span class="star">*</span>
                                    			<span>工厂评估</span>
                                    		</td>
                                    		<td colspan="5">
                                    			<div>
                                    				<label>
                                    					<input type="radio" name="estimate" value="是" />是
                                    				</label>
                                    				<lable>
                                    					<input type="radio" name="estimate" value="否" />否
                                    				</lable>
                                    			</div>
                                    			<div>
                                    				<input name="estimateReport" type="file" />
                                    			</div>
                                    		</td>
                                    	</tr>
                                   </table>
                                   </form>
                                   	<div style="margin-bottom: 50px;">
				                		<button type="button" class="btn btn-primary">确定新建</button>
					                	<button type="button" class="btn btn-default">放弃新建</button>
					                </div>
                                </div>
                                
                                
                                <!--<div class="box-footer clearfix">
                                    <ul class="pagination pagination-sm no-margin pull-right">
                                        <li><a href="#">&laquo;</a></li>
                                        <li><a href="#">1</a></li>
                                        <li><a href="#">2</a></li>
                                        <li><a href="#">3</a></li>
                                        <li><a href="#">&raquo;</a></li>
                                    </ul>
                                </div>-->
                                
                            </div><!-- /.box -->

                            
                        </div><!-- /.col -->
                        
                    </div><!-- /.row -->
                    
                </section><!-- /.content -->
                
            </aside><!-- /.right-side -->
        </div><!-- ./wrapper -->


        <!-- jQuery 2.0.2 -->
        <script src="../js/jquery.min.js"></script>
        <!-- jQuery UI 1.10.3 -->
        <script src="../js/jquery-ui-1.10.3.min.js" type="text/javascript"></script>
        <!-- Bootstrap -->
        <script src="../js/bootstrap.min.js" type="text/javascript"></script>
        <!-- AdminLTE App -->
        <script src="../js/AdminLTE/app.js" type="text/javascript"></script>
       <script src="../js/jquery.form.min.js"></script>   
        <!-- Page specific script -->
        <script type="text/javascript">
        $(function(){
        	//获取所有省数据
        	getAllProvince();
        	$('#province').change(provinceOnSelect);
        	$('#city').change(cityOnSelect);
        	//获取工厂人数列表
        	getPersonAmount();
        	//获取梳织类型列表
        	getTattingStyle();
        	//获取针织类型列表
        	getWovenStyle();
        	//获取毛衣类型列表
        	getSweaterStyle();
        	//获取销往目的地列表
        	getSaleTarget();
        	//获取合作条件
        	getCooperationCondition();
        	//新建按钮点击事件
        	$('.btn-default').click(function(){
        		window.location.href="list";
        	});
        	$(".btn-primary").click(function(){
       		 
      		
      		  $("#form").ajaxSubmit({  
    	            type : "POST",  
    	          	url: "insertFactory", 
    	            data : data,  
    	            dataType : "json",  
    	            contentType : 'application/x-www-form-urlencoded; charset=UTF-8',  
    	            success : function(map) {  
    	                if(map.body=="success"){
    	                	window.location.href="list";
    	                }else{
    	                	alert(map.body);
    	                }
    	            },  
    	            error : function(map) {  
    	                alert(map.responseText);  
    	            }  
    	  
    	        }) 
      	  });
        });
      //获取所有省数据
        function getAllProvince(){
        	var url = "../area/province";
        	$.getJSON(url,function(result){
        		if(result.head.respCode=="0000000"){
        			var provinces = result.body.rows;
        			var view = $('#province');
        			view.empty();
        			var option = $('<option value="0">请选择</option>');
        			view.append(option)
        			for(var i=0;i<provinces.length;i++){
        				var option = $('<option value="'+provinces[i].areaId+'">'+provinces[i].areaName+'</option>');
        				view.append(option);
        			}
        		}
        	});
        }

        //从服务端根据parentId获取对应的市列表
        function getCityByParentId(parentId){
        	//console.log(parentId);
        	var url = "../area/cityOrArea";
        	var data = {"parentId":parentId};
        	$.getJSON(url,data,function(result){
        		if(result.head.respCode=="0000000"){
        			var citys = result.body.rows;
        			var view = $('#city');
        			view.empty();
        			var option = $('<option value="0">请选择</option>');
        			view.append(option)
        			for(var i=0;i<citys.length;i++){
        				var option = $('<option value="'+citys[i].areaId+'">'+citys[i].areaName+'</option>');
        				view.append(option);
        			}
        		}
        	});
        }

        //从服务端根据parentId获取对应的区县列表
        function getAreaByParentId(parentId){
        	//console.log(parentId);
        	var url = "../area/cityOrArea";
        	var data = {"parentId":parentId};
        	$.getJSON(url,data,function(result){
        		if(result.head.respCode=="0000000"){
        			var areas = result.body.rows;
        			var view = $('#area');
        			view.empty();
        			var option = $('<option value="0">请选择</option>');
        			view.append(option)
        			for(var i=0;i<areas.length;i++){
        				var option = $('<option value="'+areas[i].areaId+'">'+areas[i].areaName+'</option>');
        				view.append(option);
        			}
        		}
        	});
        }

        //省下拉框选中监听事件
        function provinceOnSelect(){
        	if($(this).val()!="0"){
        		//console.log($(this).val());
        		//省选中后清空所有
        		cleanArea();
        		var provinceId = $(this).val();
        		//从服务端获取对应的城市列表
        		getCityByParentId(provinceId);
        	}
        	if($(this).val()=="0"){
        		cleanCity();
        		cleanArea();
        	}
        }

        //市下拉框选中监听事件
        function cityOnSelect(){
        	if($(this).val()!="0"){
        		var cityId = $(this).val();
        		//从服务端获取对应的区县列表
        		getAreaByParentId(cityId);
        	}
        	if($(this).val()=="0"){
        		cleanArea();
        	}
        }


        //清空市
        function cleanCity(){
        	var view = $('#city');
        	view.empty();
        	var option = $('<option value="0">请选择</option>');
        	view.append(option);
        }

        //清空区县
        function cleanArea(){
        	var view = $('#area');
        	view.empty();
        	var option = $('<option value="0">请选择</option>');
        	view.append(option);
        }

        //获取工厂人数列表
        function getPersonAmount(){
        	var constants = getConstant("scm_factory-person_amount");
        	var view = $('#personAmount');
        	view.empty();
        	for(var i=0;i<constants.length;i++){
        		var label = $('<label><input type="radio" name="personAmount" value="'+constants[i].name+'"  />'+constants[i].name+'</label>')
        		view.append(label);
        	}
        }

        //获取梳织类型列表
        function getTattingStyle(){
        	var constants = getConstant("scm_factory-tatting_style");
        	var view = $('#tattingStyle');
        	view.empty();
        	for(var i=0;i<constants.length;i++){
        		var label = $('<label><input type="checkbox" name="tattingStyleIds" value="'+constants[i].id+'"  />'+constants[i].name+'</label>')
        		view.append(label);
        	}
        }

        //获取针织类型列表
        function getWovenStyle(){
        	var constants = getConstant("scm_factory-woven_style");
        	var view = $('#wovenStyle');
        	view.empty();
        	for(var i=0;i<constants.length;i++){
        		var label = $('<label><input type="checkbox" name="wovenStyleIds" value="'+constants[i].id+'"  />'+constants[i].name+'</label>')
        		view.append(label);
        	}
        }

        //获取毛衣类型列表
        function getSweaterStyle(){
        	var constants = getConstant("scm_factory-sweater_style");
        	var view = $('#sweaterStyle');
        	view.empty();
        	for(var i=0;i<constants.length;i++){
        		var label = $('<label><input type="checkbox" name="sweaterStyleIds" value="'+constants[i].id+'"  />'+constants[i].name+'</label>')
        		view.append(label);
        	}
        }

        //获取销往目的地列表
        function getSaleTarget(){
        	var constants = getConstant("scm_factory-sale_target");
        	var view = $('#saleTarget');
        	view.empty();
        	for(var i=0;i<constants.length;i++){
        		var label = $('<label><input type="radio" name="saleTarget" value="'+constants[i].name+'"  />'+constants[i].name+'</label>')
        		view.append(label);
        	}
        }

        //获取合作条件
        function getCooperationCondition(){
        	var constants = getConstant("scm_factory-cooperation_condition");
        	var view = $('#cooperationCondition');
        	view.empty();
        	for(var i=0;i<constants.length;i++){
        		var label = $('<label><input type="radio" name="cooperationCondition" value="'+constants[i].name+'"  />'+constants[i].name+'</label>')
        		view.append(label);
        	}
        }

        //根据分类条件查询所有的常量列表
        function getConstant(category){
        	var constants={};
        	var url = "../constant/getConstantByCategory";
        	var data = {"category":category};
        	//关闭ajax异步
        	$.ajaxSettings.async = false;
        	$.getJSON(url,data,function(result){
        		if(result.head.respCode="0000000"){
        			constants = result.body.rows;
        		}
        	});
        	//开启ajax异步
        	$.ajaxSettings.async = true;
        	return constants;
        }

        //新增工厂
        function addFactory(){
        	
        	/*var factoryName= $('#factoryName').val();
        	console.log(factoryName);
        	var provinceId = $('#province').val();
        	console.log(provinceId);
        	var cityId = $('#city').val();
        	console.log(cityId);
        	var areaId = $('#area').val();
        	console.log(areaId);
        	var detailAddress = $('#detailAddress').val();
        	console.log(detailAddress);
        	var linkman = $('#linkman').val();
        	console.log(linkman);
        	var contact = $('#contact').val();
        	console.log(contact);
        	var personAmount = $("input[name='personAmount']:checked").val();
        	console.log(personAmount);
        	var tattingStyleIds = [];
        	$('input[name="tattingStyle"]:checked').each(function(){ 
        		tattingStyleIds.push($(this).val()); 
        	}); 
        	console.log(tattingStyleIds);
        	var wovenStyleIds = [];
        	$('input[name="wovenStyle"]:checked').each(function(){ 
        		wovenStyleIds.push($(this).val()); 
        	}); 
        	console.log(wovenStyleIds);
        	var sweaterStyleIds = [];
        	$('input[name="sweaterStyle"]:checked').each(function(){ 
        		sweaterStyleIds.push($(this).val()); 
        	}); 
        	console.log(sweaterStyleIds);
        	var saleTarget = $("input[name='saleTarget']:checked").val();
        	console.log(saleTarget);
        	var cooperationCondition = $("input[name='cooperationCondition']:checked").val();
        	console.log(cooperationCondition);
        	var estimate = $("input[name='estimate']:checked").val();
        	console.log(estimate);
        	var estimateReport= $('#estimateReport').serialize();
        	console.log(estimateReport);
        	
        	var url="/jhzz_scm/factory/insertFactory";
        	var data ={"factoryName":factoryName,"provinceId":provinceId,
        			   "cityId":cityId,"areaId":areaId,"detailAddress":detailAddress,
        			   "linkman":linkman,"contact":contact,"personAmount":personAmount,
        			   "tattingStyleIds":tattingStyleIds,"wovenStyleIds":wovenStyleIds,
        			   "sweaterStyleIds":sweaterStyleIds,"saleTarget":saleTarget,
        			   "cooperationCondition":cooperationCondition,"estimate":estimate}
        	$.post(url,data,function(result){
        		if(result.head.respCode="0000000"){
        			console.log("新增成功");
        		}
        	});*/
        }
        </script>

    </body>
</html>
